<%--
  Created by IntelliJ IDEA.
  User: 吉良吉影
  Date: 2022/1/5
  Time: 16:51
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!--	用base标签永远固定相对路径跳转时的效果-->
<%String basePath= request.getScheme()
        +"://"
        +request.getServerName()
        +":"
        +request.getServerPort()
        +request.getContextPath()
        +"/";
%>
<base href="<%=basePath%>">
<!-- 顶部模块start -->
<section class="top">
    <script src="../../jquery/jquery-3.6.0.js"></script>
    <script>
        $(function () {
            $(".add-cart").click(function () {
                var id = $(this).attr("phoneId");
                $.getJSON("${basePath}cartServlet", "action=ajaxAddItem&id=" + id, function (data) {
                    if (data != null && data.totalCount != 0) {
                        $("#cartTotalCount").html("(" + data.totalCount + ")");
                        $(".cart_list").html("购物车中已有" + data.totalCount + "个商品");
                    } else {
                        $("#cartTotalCount").text("(0)");
                        $(".cart_list").text("购物车中还没有商品，赶紧选购吧！");
                    }

                });
            });
        });
    </script>
    <div class="w">
        <div class="fl">
            <ul>
                <li><a>Shoppe</a></li>
                <li>|</li>
                <li><a>MIUI</a></li>
                <li>|</li>
                <li><a>IoT</a></li>
                <li>|</li>
                <li><a>云服务</a></li>
                <li>|</li>
                <li><a>天星数科</a></li>
                <li>|</li>
                <li><a>有品</a></li>
                <li>|</li>
                <li><a>小爱开放平台</a></li>
                <li>|</li>
                <li><a>企业团购</a></li>
                <li>|</li>
                <li><a>资质证照</a></li>
                <li>|</li>
                <li><a>协议规则</a></li>
                <li>|</li>
                <li class="downloadApp">
                    <a>下载app</a>
                    <div class="download">
                        <a>
                            <img src="./static/img/common/download.png" alt="" />
                            <p>Shoppe商城APP</p>
                        </a>
                    </div>
                    <div class="triangle"></div>
                </li>
                <li>|</li>
                <li><a>智能生活</a></li>
                <li>|</li>
                <li><a>Select Location</a></li>
            </ul>
        </div>
        <div class="cart">
            <c:if test="${empty sessionScope.user}">
                <a href="login.jsp">
            </c:if>
            <c:if test="${not empty sessionScope.user}">
                <a href="cart.jsp">
            </c:if>
                <em class="cart_img iconfont">&#xe735;</em>
                <em>购物车</em>
                <c:choose>
                    <c:when test="${sessionScope.cart==null||sessionScope.cart.totalCount==0}">
                        <em id="cartTotalCount" class="cart_num">(0)</em>
                    </c:when>
                    <c:otherwise>
                        <em id="cartTotalCount" class="cart_num">(${sessionScope.cart.totalCount})</em>
                    </c:otherwise>
                </c:choose>
            </a>
            <c:if test="${sessionScope.cart==null||sessionScope.cart.totalCount==0}">
                <div class="cart_list">购物车中还没有商品，赶紧选购吧！</div>
            </c:if>
                <c:if test="${sessionScope.cart!=null&&sessionScope.cart.totalCount!=0}">
                <div class="cart_list">购物车中已有${sessionScope.cart.totalCount}个商品</div>
                </c:if>

        </div>
        <div class="fr">
            <c:choose>
                <c:when test="${empty sessionScope.user}">
                    <ul>
                        <li><a href="./login.jsp">登录</a></li>
                        <li>|</li>
                        <li><a href="./register.jsp">注册</a></li>
                        <li>|</li>
                            <li><a href="orderServlet?action=listOrder" class="a_three">我的订单(0)</a></li>
                    </ul>
                </c:when>
                <c:otherwise>
                    <ul>
                        <li><a>用户${sessionScope.user.username}  您好!</a></li>
                        <li>|</li>
                        <li><a href="userServlet?action=cancell">注销</a></li>
                        <li>|</li>
                        <c:if test="${empty sessionScope.orderCount}">
                            <li><a href="orderServlet?action=listOrder" class="a_three">我的订单(0)</a></li>
                        </c:if>
                        <c:if test="${not empty sessionScope.orderCount}">
                            <li><a href="orderServlet?action=listOrder" class="a_three">我的订单(${sessionScope.orderCount})</a></li>
                        </c:if>
                    </ul>
                </c:otherwise>
            </c:choose>
        </div>
    </div>
</section>
<!-- 顶部模块end -->